<template>
  <h2>MyPage</h2>
  <h3>{{$route.params.id}}</h3>
  <h3>pid：{{pid}}</h3>
  <h3>id：{{id}}</h3>
</template>

<script>
import{ useRoute } from 'vue-router';
import {ref, watch} from "vue";
export default {
  name: "MyPage",
  //原生写法
  computed:{
    pid(){
      return this.$route.params.id;
    }
  },
  setup(){
    const route = useRoute();
    // let id = route.params.id;
    let id = ref();
    watch(()=>route.params,(newid)=>{
      console.log(newid.id);
      id.value = newid.id;
    },{immediate:true})
    return{
      id
    }
  }
}
</script>

<style scoped>

</style>